import 'package:flutter/material.dart';
import 'package:flutter_ability/custom_ui.dart';

class TextPage extends StatefulWidget {
  const TextPage({Key? key}) : super(key: key);

  @override
  State<TextPage> createState() => _TextPageState();
}

class _TextPageState extends State<TextPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: TextView.text("字体", fontSize: YJSize.SP_16, isLineHeight: false),
        leading: InkWell(
          child: const Icon(
            Icons.arrow_back_ios,
            size: 16,
            color: Colors.black87,
          ),
          onTap: () {
            Navigator.pop(context);
          },
        ),
        backgroundColor: Colors.white,
      ),
      body: Container(
        padding: const EdgeInsets.only(left: 16, right: 16),
        child: buildCenter(context),
      ),
    );
  }

  buildCenter(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        const SizedBox(height: 10),
        TextView.text("公式：「 行高 = 字号 + n 」n 默认8"),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: YJColors.SECONDARY,
              child: TextView.text("38行高", fontSize: YJSize.SP_38),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: YJColors.SECONDARY,
              child: TextView.text("38不带行高",
                  fontSize: YJSize.SP_38, isLineHeight: false),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: YJColors.PRIMARY,
              child: TextView.text("32行高", fontSize: YJSize.SP_32),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: YJColors.PRIMARY,
              child: TextView.text("32不带行高",
                  fontSize: YJSize.SP_32, isLineHeight: false),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: YJColors.THEME_COLOR,
              child: TextView.text("28默认行高", fontSize: YJSize.SP_28),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: YJColors.THEME_COLOR,
              child: TextView.text("28不带行高",
                  fontSize: YJSize.SP_28, isLineHeight: false),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Container(
          color: Colors.red,
          child: Row(
            children: [
              Container(
                color: YJColors.SUCCESS,
                child: TextView.text("22默认行高", fontSize: YJSize.SP_22),
              ),
              SizedBox(width: YJSize.DIVIDER),
              Container(
                color: YJColors.SUCCESS,
                child: TextView.text("22不带行高",
                    fontSize: YJSize.SP_22, isLineHeight: false),
              ),
            ],
          ),
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: YJColors.THEME_COLOR,
              child: TextView.text("20默认行高", fontSize: YJSize.SP_20),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: YJColors.THEME_COLOR,
              child: TextView.text("20不带行高",
                  fontSize: YJSize.SP_20, isLineHeight: false),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: Colors.greenAccent,
              child: TextView.text("18默认行高", fontSize: YJSize.SP_18),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.greenAccent,
              child: TextView.text("18不带行高",
                  fontSize: YJSize.SP_18, isLineHeight: false),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.greenAccent,
              child: TextView.text("18粗体",
                  fontWeight: FontWeight.w600, fontSize: YJSize.SP_18),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: Colors.blue,
              child: TextView.text("16默认行高", fontSize: YJSize.SP_16),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.blue,
              child: TextView.text("16不带行高",
                  fontSize: YJSize.SP_16, isLineHeight: false),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.blue,
              child: TextView.text("16粗体",
                  fontWeight: FontWeight.w600, fontSize: YJSize.SP_16),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: Colors.green,
              child: TextView.text("14默认行高", fontSize: YJSize.SP_14),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.green,
              child: TextView.text("14不带行高",
                  fontSize: YJSize.SP_14, isLineHeight: false),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.green,
              child: TextView.text("14粗体",
                  fontWeight: FontWeight.w600, fontSize: YJSize.SP_14),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: Colors.grey,
              child: TextView.text("12默认行高", fontSize: YJSize.SP_12),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.grey,
              child: TextView.text("12不带行高",
                  fontSize: YJSize.SP_12, isLineHeight: false),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.grey,
              child: TextView.text("12粗体",
                  fontWeight: FontWeight.w600, fontSize: YJSize.SP_12),
            ),
          ],
        ),
        const SizedBox(height: 10),
        Row(
          children: [
            Container(
              color: Colors.grey,
              child: TextView.text("10默认行高", fontSize: YJSize.SP_10),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.grey,
              child: TextView.text("10不带行高",
                  fontSize: YJSize.SP_10, isLineHeight: false),
            ),
            SizedBox(width: YJSize.DIVIDER),
            Container(
              color: Colors.grey,
              child: TextView.text("10粗体",
                  fontWeight: FontWeight.w600, fontSize: YJSize.SP_10),
            ),
          ],
        ),
      ],
    );
  }
}
